﻿
@{
    ViewBag.Title = "短信活动";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<section class="content-header">
    <h1>
        活动管理
        <small></small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i>主页</a></li>
        <li class="active">活动列表</li>
    </ol>
</section>
<section class="content">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header">
                    <form id="search-form" class="form-inline">
                        <div class="form-group">
                            <label>车型</label>
                            <input class="form-control" name="carName" id="carName" type="text" placeholder="车型">
                        </div>
                        <div class="form-group">
                            <label>车型简称</label>
                            <input class="form-control" name="carShortName" id="carShortName" type="text" placeholder="车型简称">
                        </div>
                        <div class="form-group">
                            <label>微信号</label>
                            <input class="form-control" name="wxCode" id="wxCode" type="text" placeholder="微信号">
                        </div>

                        <div class="form-group">
                            <button class="btn btn-success" id="btnSearch" type="button">查询</button>
                            <button class="btn btn-primary" id="btnAdd" onclick="javascript:location.href='Detail'" type="button">添加</button>
                        </div>
                    </form>
                </div>
                <!-- /.box-header -->
                <div class="box-body table-responsive no-padding">
                    <table class="table table-bordered table-hover body-table-head">
                        <thead>
                            <tr>
                                <th>
                                    微信
                                </th>
                                <th>
                                    车型
                                </th>
                                <th>
                                    车型简称
                                </th>
                                <th>
                                    创建时间
                                </th>
                                <th class="t_c">
                                    操作
                                </th>
                            </tr>
                        </thead>
                        <tbody id="tbodylist"></tbody>
                    </table>
                    <div class="no-data" id="nodata" style="display:none;">
                        <div class="img-box"></div>
                        <div class="text">暂无数据</div>
                    </div>
                </div>
                <div class="box-footer clearfix ">
                    <ul id="pagination" class="pagination pagination-sm no-margin pull-right"></ul>
                </div>
                <!-- /.box-body -->
                <!-- /.box -->
            </div>
        </div>
    </div>

    <!-- 模态框（Modal） -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title">
                        提示
                    </h4>
                </div>
                <div class="modal-body" id="myModalBody">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">
                        关闭
                    </button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal -->
    </div>
</section>
@section scriptsBottom{
    <script src="@Url.Content("~/lib/art-template/template-web.js")"></script>
    <script id="orderItemTpl" type="text/html">
        {{each rows}}
        <tr>
            <td>
                {{$value.WxCode}}
            </td>
            <td>
                {{$value.CarName}}
            </td>
            <td>
                {{$value.CarShortName}}
            </td>
            <td>
                {{$value.CreateDate}}
            </td>
            <td class="t_c">
                <a href="Detail?id={{$value.ID}}" class="btn btn-primary btn-xs">查询</a>
            </td>
        </tr>
        {{/each}}
    </script>
    <script type="text/javascript">
        //时间绑定
        $('#bDate').datepicker({
            autoclose: true,
            language: "zh-CN"
        });
        $('#eDate').datepicker({
            autoclose: true,
            language: "zh-CN"
        });

        //页码
        var pageIndex = 1;
        var rows = [];

        //查询
        $('#btnSearch').click(function () {
            pageIndex = 1;
            search();
        });

        //查询
        function search() {
            var formData = $("#SearchForm").serializeArray();
            formData.push({ name: "PageSize", value: 15 });
            formData.push({ name: "PageIndex", value: pageIndex });

            //查询列表
            $.ajax({
                url: '@Url.Action("List", "ActivityMessage")',
                data: formData,
                type: 'POST',
                success: function (data) {
                    if (data.status != 0) {
                        $("#nodata").show();
                        document.getElementById('OrderContainer').innerHTML = "";
                        return;
                    }
                    if (data.data.length < 1) {
                        $("#nodata").show();
                        document.getElementById('OrderContainer').innerHTML = "";
                        return;
                    }
                    $("#nodata").hide();
                    //模板渲染
                    var html = template('orderItemTpl', data.data);
                    document.getElementById('tbodylist').innerHTML = html;
                    //缓存数据
                    rows = data.data.rows;

                    //分页显示
                    $('#pagination').twbsPagination("destroy");
                    $('#pagination').twbsPagination({
                        totalItems: data.data.total,
                        visiblePages: 10,
                        pageSize: 15,
                        startPage: parseInt(pageIndex),
                        onPageClick: function (event, page) {
                            pageIndex = page;
                            search();
                        }
                    });
                }
            });
        }
    </script>
}
